﻿<div id="Content-Body" style="min-width:1000px;">
    <div class="toggle">
        <span class="data-fill" resource="Admins-Table-Paging">共 @Total 条数据</span>

        <button class="item active">所有管理员</button>
    </div>
    <div class="tools">
        <!--<input type="button" class="button right super-search" resource="Admins-Table" value="高级搜索" />-->
        <form class="filter right" resource="Admins-Table,Admins-Table-Paging">
            <input class="left w280 input" type="text" name="[Fuzzy]UserName_c,[ORFuzzy]Contact" placeholder="搜索登录名或联系人..." /><input type="submit" class="right button" value="Q" />
        </form>

        <!--<input type="button" class="tool button refresh" resource="Admins-Table" value="刷新" />-->
        <input type="button" class="tool button insert" resource="Admins-Table" frame="TempAdminFrame" command="InsertAdminAndRole" value="新增" />
        <input type="button" class="tool button update" resource="Admins-Table" frame="TempAdminFrame" command="UpdateAdminAndRole" value="修改" />
        <input type="button" class="tool button delete" resource="Admins-Table" command="DeleteAdminAndRole" value="删除" />
    </div>
    <div class="table-box">
        <table class="table" id="Admins-Table" command="ReadPageAdmins" parameters="Begin:1,End:12,DefaultOrders:'DId'">
            <thead>
                <tr>
                    <td name="selection" style="width:30px;"><input type="checkbox" /></td>
                    <td class="sort" name="Id" style="width:30px;">ID</td>
                    <td class="sort" name="UserName_c" style="width:80px;">登录名</td>
                    <td class="sort" name="RoleName" style="width:80px;">角色</td>
                    <td class="sort" name="Contact" style="width:80px;">联系人</td>
                    <td class="sort" name="ContactPhone" style="width:80px;">联系电话</td>
                </tr>
            </thead>
        </table>
    </div>

    <div id="Admins-Table-Paging" command="GetAdminsTotal" resource="Admins-Table"></div>

    <!--<form id="TempAdminFrame" text="管理员信息" class="frame temp" onsubmit="return app.frameSubmit(this)" style="width:480px;height:380px;margin-left: 0px; margin-top: 0px; top: 20%; left: 20%;">
        <div class="top">
            <span class="title">查看/修改管理员信息</span>
            <div class="right">
                <span class="min" title="最小化"></span>
                <span class="max" title="最大化"></span>
                <span class="close" title="关闭"></span>
            </div>
        </div>
        <div class="content" readonly-where="data.Readonly">
            <div class="content">
                <span class="title">基本信息</span>
                <input type="hidden" name="Id" />
                <div class="item">
                    <label class="text">*登录名：</label>
                    <input verify="notNull" class="input w280" type="text" name="UserName_c" placeholder="登录名" />
                </div>
                <div class="item">
                    <label class="text">*密码：</label>
                    <input verify="notNull" class="input w280" type="password" name="Password" field="密码" placeholder="密码" />
                </div>
                <div class="item">
                    <label class="text">*角色：</label>
                    <select verify="notNull" class="input none list w280" id="Roles-List" name="Role" field="角色" command="ReadListRoles" menu-name="角色 List"></select>
                </div>
                <div class="item">
                    <label class="text">*联系人：</label>
                    <input verify="notNull" class="input w280" type="text" name="Contact" placeholder="联系人" />
                </div>
                <div class="item">
                    <label class="text">*联系电话：</label>
                    <input verify="notNull,mobileOrPhone" class="input w280" type="text" name="ContactPhone" placeholder="联系电话" />
                </div>
            </div>
        </div>
        <div class="bottom">
            <input type="submit" class="button" value="保存修改" display-where="!data.Readonly" />
            <input type="button" class="button close" value="返回" />
        </div>
    </form>-->

    <form id="TempAdminFrame" text="管理员信息" class="frame temp" onsubmit="return app.frameSubmit(this)">
        <div class="top">
            <div class="right">
                <span class="min" title="最小化"></span>
                <span class="max" title="最大化"></span>
                <span class="close" title="关闭"></span>
            </div>
            <span class="title">查看/修改管理员信息</span>
        </div>
        <div class="content" readonly-where="data.Readonly">
            <input type="hidden" name="Id" />
            <div class="content">
                <span class="title">登录信息</span>
                <div class="item">
                    <label class="text">*登录名：</label>
                    <input verify="notNull" class="input w320" readonly-where="data.Id" type="text" name="UserName_c" placeholder="登录名" />
                </div>
                <div class="item">
                    <label class="text">*密码：</label>
                    <input verify="notNull" class="input w320" type="password" autocomplete="off" name="Password" field="密码" placeholder="密码" />
                </div>
            </div>
            <div class="content">
                <span class="title">角色信息</span>
                <div class="item">
                    <label class="text">*角色名称：</label>
                    <input verify="notNull" class="input w320" type="text" name="RoleName" placeholder="角色名称" />
                </div>
                <div class="item">
                    <label class="text">*角色说明：</label>
                    <input verify="notNull" class="input w320" type="text" name="RoleAddress" placeholder="角色说明" />
                </div>
                <div class="item">
                    <label class="text">*联系人：</label>
                    <input verify="notNull" class="input w320" type="text" name="Contact" placeholder="联系人" />
                </div>
                <div class="item">
                    <label class="text">*联系电话：</label>
                    <input verify="notNull,mobileOrPhone" class="input w320" type="text" name="ContactPhone" placeholder="联系电话" />
                </div>
            </div>
            <div id="AuthorizesBox" style="white-space:nowrap;overflow:hidden;">
                <div id="AuthorizeMenus" class="content many inline-block" field="Id" command="AdminAuthorizeMenus">
                    <span class="title">菜单授权</span>
                    <div id="AuthorizeMenusItem" class="item" style="height:333px;overflow:auto;display:block;padding:0;">
                        <ul id="Menus-Tree" class="tree checkbox savestate" command="ReadTreeAuthorizeMenus" menu-name="菜单 TreeView"></ul>
                    </div>
                </div><div id="AuthorizeDictionarys" class="content many inline-block" field="Id" command="AdminAuthorizeDictionarys">
                    <span class="title">字典授权</span>
                    <div id="AuthorizeDictionarysItem" class="item" style="height:333px;overflow:auto;display:block;padding:0;">
                        <ul id="Dictionarys-Tree" class="tree checkbox savestate" command="ReadTreeAuthorizeDictionarys" menu-name="字典 TreeView"></ul>
                    </div>
                </div>
            </div>
        </div>
        <div class="bottom">
            <input type="submit" class="button" value="保存修改" display-where="!data.Readonly" />
            <input type="button" class="button close" value="返回" />
        </div>
    </form>

    <script>
        $("#TempAdminFrame").on("process", function (e, Data) {
            Data.Avatar = "/image/DefaultAvatar.jpg";
            Data.Nickname = Data.Contact || Data.UserName_c;
            Data.Password = Data.Password ? Data.Password : null;
        });

        $("#AuthorizeMenusItem").on("process", function (e, Data) {
            var MenusTree = $(this).find("#Menus-Tree")[0];

            var Selected = MenusTree.getSelected();

            var MenuId = "";

            $(Selected).each(function () {
                MenuId += "," + this.Id;
            });

            MenuId = MenuId.substr(1);

            Data.MenuId = MenuId;
        });

        $("#AuthorizeDictionarysItem").on("process", function (e, Data) {
            var DictionarysTree = $(this).find("#Dictionarys-Tree")[0];

            var Selected = DictionarysTree.getSelected();

            var DictionaryId = "";

            $(Selected).each(function () {
                if (!isNaN(parseInt(String(this.Id)))) {
                    DictionaryId += "," + this.Id;
                }
            });

            DictionaryId = DictionaryId.substr(1);

            Data.DictionaryId = DictionaryId;
        });

        $("#TempAdminFrame").on("apply", function (e, Data) {
            var IsInsert = $(this).attr("command").indexOf("Insert") != -1;

            if (!IsInsert && Data.IsShowApply) {
                return false;
            }

            $(this).resize(Resize);

            Resize.apply(this);

            function Resize() {
                var AuthorizesBox = $(this).find("#AuthorizesBox");

                $(this).find("#AuthorizeMenus").width((AuthorizesBox.width() - 36) / 2);
                $(this).find("#AuthorizeDictionarys").width((AuthorizesBox.width() - 36) / 2);
            }

            if (!IsInsert) {
                $(this).find("[name=Password]").attr("placeholder", "不输入则不修改").css("font-style", "italic").removeAttr("verify");
                $(this).find("[name=UserName_c]").prop("disabled", true);
            }

            /* 默认授权的菜单 Id */
            var DefaultMenus = [];

            /* 菜单授权 */

            var MenusTree = $(this).find("#Menus-Tree");

            MenusTree.prop("parameters", { Id: 0, RoleId: Data.Role });

            app.control(MenusTree, "tree");

            MenusTree.on("process", function (e, Data) {
                Data.treeText = Data.Name;
                Data.treeType = Data.Type == 4 ? "node" : "dir";
                Data.treeIcon = null;

                if (IsInsert && DefaultMenus.indexOf(Data.Id) != -1) {
                    Data.IsAuthorized = true;
                }

                if (Data.IsAuthorized) {
                    Data.Checked = true;
                    Data.Expanded = true;
                }

                e.stopPropagation();
            });



            /* 字典授权 */

            var DictionarysTree = $(this).find("#Dictionarys-Tree");

            DictionarysTree.prop("parameters", { Id: "-", RoleId: Data.Role });

            app.control(DictionarysTree, "tree");

            DictionarysTree.on("process", function (e, Data) {
                Data.treeText = Data.Name;
                Data.treeType = Data.Value ? "node" : "dir";
                Data.treeIcon = null;

                if (IsInsert) {
                    /* 默认全部选中 */
                    Data.IsAuthorized = true;
                }

                if (Data.IsAuthorized) {
                    Data.Checked = true;
                    Data.Expanded = true;
                }
                if (!Data.Value) {
                    Data.Checkbox = false;
                }

                e.stopPropagation();
            });
        });

        $("#TempAdminFrame").on("show", function (e, Data) {
            app.apply($(this), { IsShowApply: true, Role: 0 });
        });


        $.extend(window, {
        });

        app.control($("#Admins-Table"), "table");
        app.control($("#Admins-Table-Paging"), "paging");
        app.control($("#Content-Body"), "content");
        app.control($("#Roles-List"), "list");
    </script>
</div>